<!--suppress ALL-->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>订单详情</title>

    <!-- Favicons -->
    <link rel="shortcut icon" th:href="@{/assets/images/favicon.ico}">
    <link rel="stylesheet" th:href="@{/assets/css/vendor/vendor.min.css}">
    <link rel="stylesheet" th:href="@{/assets/css/plugins/plugins.min.css}">
    <link rel="stylesheet" th:href="@{/assets/css/style.min.css}">
    <script th:src="@{/assets/js/jquery-3.2.1.slim.min.js}"></script>


</head>

<body>
    <!-- Header Section Start -->
    <div class="header section" th:replace="~{common/head::head}"></div>
    <!-- Header Section End -->

    <!-- Breadcrumb Area Start -->
    <div class="section breadcrumb-area bg-name-bright">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <div class="breadcrumb-wrapper">
                        <h2 class="breadcrumb-title">我的订单</h2>
                        <ul>
                            <li><a href="#">Home</a></li>
                            <li>Checkout</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Breadcrumb Area End -->

    <!-- Checkout Section Start -->
    <div class="section section-margin">
        <div class="container">

            <div class="row m-b-n20">
                <div class="col-lg-4 col-12 m-b-20">

                    <!-- Checkbox Form Start -->
                    <form action="#">
                        <div class="checkbox-form">

                            <!-- Checkbox Form Title Start -->
                            <h3 class="title">收货地址</h3>
                            <!-- Checkbox Form Title End -->

                            <div class="row">

                                <!-- First Name Input Start -->
                                <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label>收件人 <span class="required">*</span></label>
                                        <input id="rname" th:value="${address.receiverName}" readonly type="text" >
                                    </div>
                                </div>
                                <!-- First Name Input End -->

                                <!-- Last Name Input Start -->
                                <div class="col-md-6">
                                    <div class="checkout-form-list">
                                        <label>手机号 <span class="required">*</span></label>
                                        <input id="rphone" th:value="${address.receiverPhone}" readonly type="text">
                                    </div>
                                </div>
                                <!-- Last Name Input End -->

                                <!-- Company Name Input Start -->
                                <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <label>省份-城市-区/县 <span class="required">*</span></label>
                                        <input id="rarea" th:value="${address.area}" readonly type="text">
                                    </div>
                                </div>
                                <!-- Company Name Input End -->

                                <!-- Address Input Start -->
                                <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <label>详细地址 <span class="required">*</span></label>
                                        <input id="raddress" th:value="${address.itemAddress}" readonly type="text">
                                    </div>
                                </div>
                                <!-- Address Input End -->

                                <!-- Town or City Name Input Start -->
                                <div class="col-md-12">
                                    <div class="checkout-form-list">
                                        <label>邮箱 </label>
                                        <input id="remail" th:value="${address.receiverEmail}" readonly type="text">
                                    </div>
                                </div>
                                <!-- Town or City Name Input End -->
                            </div>
                        </div>
                    </form>
                    <!-- Checkbox Form End -->

                </div>

                <div class="col-lg-8 col-12 m-b-20">

                    <!-- Your Order Area Start -->
                    <div class="your-order-area border">

                        <!-- Title Start -->
                        <h3 class="title">您的订单</h3>
                        <!-- Title End -->

                        <!-- Your Order Table Start -->
                        <div >
                            <table class="table">

                                <!-- Table Head Start -->
                                <thead>
                                    <tr class="cart-product-head">
                                        <th >商品</th>
                                        <th >数量</th>
                                        <th >封面</th>
                                        <th class="text-end">价格</th>
                                    </tr>
                                </thead>
                                <!-- Table Head End -->

                                <!-- Table Body Start -->
                                <tbody>
                                    <tr class="cart_item" th:each="goods : ${goodsInfo}">
                                        <td>
                                            <a th:href="@{/goods/singleGoods(goodId=${goods.goodsId},goodsTypeName=${goods.goodsTypeName})}"><strong th:text="${goods.goodsName}"></strong></a>
                                        </td>
                                        <td ><strong class="product-quantity" th:text="${goods.buyCount}"></strong><span>个 </span></td>
                                        <td ><img th:src="'http://localhost:8080/uploadFile/product/'+${goods.cover}" style="width: 50px;height: 50px"></img></td>
                                        <td class="cart-total text-end pe-0"><span>¥ </span><span class="amount" th:text="${goods.allPrice}"></span></td>
                                    </tr>
                                </tbody>
                                <!-- Table Body End -->

                                <!-- Table Footer Start -->
                                <tfoot>
                                    <tr class="cart-subtotal">
                                        <th class="text-start ps-0" colspan="3">购物车小计</th>
                                        <td class="text-end pe-0"><span>¥ </span><span class="cartamount" th:text="${total}"></span></td>
                                    </tr>
                                    <tr class="order-total">
                                        <th class="text-start ps-0" colspan="3">订单总价</th>
                                        <td class="text-end pe-0"><span>¥ </span><strong><span class="orderamount" th:text="${total}"></span></strong></td>
                                    </tr>
                                </tfoot>
                                <!-- Table Footer End -->

                            </table>
                        </div>
                        <!-- Your Order Table End -->

                        <!-- Payment Accordion Order Button Start -->
                        <div class="payment-accordion-order-button">
                            <div class="payment-accordion">
                                <div class="single-payment">
                                    <h5 class="panel-title m-b-15">
                                        <a class="collapse-off" data-bs-toggle="collapse" href="#collapseExample-3" aria-expanded="false" aria-controls="collapseExample-3">
                                            欢迎下次光临.
                                        </a>
                                    </h5>
                                    <div class="collapse" id="collapseExample-3">
                                        <div class="card card-body rounded-0">
                                            <p>你爱我，我爱你，蜜雪冰城甜蜜蜜！</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                                <button type="button" onclick="" class="btn btn-gray-deep btn-hover-dark rounded-0 w-25" style="margin-top: 50px">申请退款</button>
                                <button type="button" onclick="" class="btn btn-danger btn-hover-dark rounded-0 w-50" style="margin-top: 50px;float: right">确认收货</button>
                        </div>
                        <!-- Payment Accordion Order Button End -->
                    </div>
                    <!-- Your Order Area End -->
                </div>
            </div>
        </div>
    </div>
    <!-- Checkout Section End -->

    <!-- Footer Section Start -->
    <footer class="section footer-section" th:replace="~{common/foot::foot}"></footer>
    <!-- Footer Section End -->


    <script th:src="@{/assets/js/vendor.min.js}"></script>
    <script th:src="@{/assets/js/plugins.min.js}"></script>

    <!--Main JS-->
    <script th:src="@{/assets/js/main.js}"></script>

</body>

    <script>


    </script>
</html>